<template>
  <a-modal
    v-model:open="visible"
    :width="width"
    :title="title"
    :height="height"
    :okText="okText"
    @ok="confirm"
    :confirmLoading="Loading"
    :btnShow="btnShow"
  >

    <div style="height: 30px"></div>
    <slot name="contentValue"></slot>
  </a-modal>

  <!-- <a-image :style="{ display: 'none', }" :preview="{
        visible,
        onVisibleChange: setVisible,
    }" src="https://liangpiao-ticket-img.oss-cn-beijing.aliyuncs.com/replyAnswerImg/0e2e247dd14148d9900208c1dbe70ec0.jpg"
        style=" max-height: 70%;" /> -->
</template>

<script setup lang="ts">
import { ref, toRefs } from 'vue'

const visible = ref(false)
const prop = defineProps({
  width: {
    type: Number,
    default: '500',
  },
  height: {
    type: Number,
    default: '500',
  },
  title: {
    type: String,
    default: '',
  },
  okText: {
    type: String,
    default: '确认',
  },
  Loading: {
    type: Boolean,
    default: false,
  },
  btnShow: {
    type: Boolean,
    default: false,
  },
})
const { width, height, title, okText, Loading, btnShow } = toRefs(prop)

const setVisible = (flag: boolean) => {
  visible.value = flag
}

const confirm = () => {
  emit('onConfirmAdd')
}

const emit = defineEmits<{
  refresh: []
  onConfirmAdd: []
}>()

defineExpose({
  setVisible,
})
</script>
<style scoped lang="less"></style>
